<!DOCTYPE html>
<html>
<head>
  <title>Table Width Test</title>
  <style>
    table.Table2
    {
      table-layout: fixed;
      width: 30em;
      border-collapse: collapse;
      background: silver;
    }
    td
    {
      border: 1px solid black;
      background: white;
    }
    .Cell1
    {
      width: 8em;
    }
    .Cell2
    {
      width: 16em;
    }
    .Cell3
    {
      width: 3em;
    }

    div
    {
      display: inline-block;
    }
    div.Wrapper
    {
      background-color: green;
      border: 1px solid red;
      vertical-align: middle;
    }
    div.Content
    {
      background-color: yellow;
    }
  </style>
</head>
<body>

<table>
  <td style="vertical-align: middle">
    <div class="Wrapper" style="width:200px;height:200px;overflow: hidden">
      <div class="Content" style="width:400px;height:400px;transform:scale(0.5);transform-origin:0 0;">Content here</div>
    </div>
  </td>
</table>

<table class="Table2">
  <tr>
    <td class="Cell1">Cell11</td>
    <td class="Cell2">Cell12</td>
    <td class="Cell3">Cell13</td>
  </tr>
  <tr>
    <td class="Cell1">Cell21</td>
    <td class="Cell2">Cell22</td>
    <td class="Cell3">Cell23</td>
  </tr>
  <tr>
    <td class="Cell1">Cell31</td>
    <td class="Cell2">Cell32</td>
    <td class="Cell3">Cell33</td>
  </tr>
</table>

</body>
</html>